<template>
	<view>
		<!-- TODO 首页 -->
		<u-search v-model="form.keyword" placeholder="请输入搜索内容" margin="20rpx 24rpx" :show-action="false" height="68"></u-search>
		
		<uni-list>
			<uni-swipe-action>
				<uni-swipe-action-item v-for="(item, index) in list" ::key="item.id" :right-options="item.is_top == 1 ? cancelOptions : options">
					<uni-list-chat to="/pages/index/room?id=1" :class="{top: item.is_top == 1}" :title="item.nickname" :note="item.last_message" :clickable="true" :badgeText="item.no_read_num" badgePositon="left" :time="item.last_time" :avatar="item.avatar"></uni-list-chat>
				</uni-swipe-action-item>
			</uni-swipe-action>
		</uni-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					keyword: ''
				},
				list: [
					{id: 1, nickname: '简单', last_message: '你好', last_time: '19:20', avatar: '/static/logo.png', no_read_num: 10, is_top: 1},
					{id: 2, nickname: '简单', last_message: '你好', last_time: '19:20', avatar: '/static/logo.png', no_read_num: 10, is_top: 2},
				],
				options: [
					{text: '置顶', style: {backgroundColor: '#2FD6AC'}},
					{text: '删除', style: {backgroundColor: '#FD6050'}}
				],
				cancelOptions: [
					{text: '取消置顶', style: {backgroundColor: '#D7D7D7'}},
					{text: '删除', style: {backgroundColor: '#FD6050'}}
				]
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style lang="scss">
	.top {
		background-color: #EEEEEE !important;
	}
</style>
